{% extends "base.html" %}

{% block content %}

<div id="planet-cont">
<div id="left">

<div class="box_bg boxes_plan">
<h1>Planet Total Resources</h1><br />
<table>
<tr><td>Minerals</td>
<td class="amount">{{planet.resourceStorage.resourceOne}}</td></tr>
<tr><td>Water</td>
<td class="amount">{{planet.resourceStorage.resourceTwo}}</td></tr>
<tr><td>Fuel</td>
<td class="amount">{{planet.resourceStorage.resourceThree}}</td></tr>
<tr><td>Organic</td>
<td class="amount">{{planet.resourceStorage.resourceFour}}</td></tr>
</table>
<hr /><p align="center">
Resources always collectable.</p>
{% if colony.collectable %}
<input type="button" style="display:block; text-align: center;" class="green-button" onClick="window.location='/collect/resources/?colony_key={{colony.key}}';" value='COLLECT'>
{% else %}
    <span class="red-button">WAIT TO COLLECT</span>
{% endif %}
</div>
<div class="box_bg boxes_plan">
<h1>Colony Resources</h1>
<br />
<table>
<tr><td>Minerals</td>
<td class="amount">{{resourceStorage.resourceOne}}</td></tr>
<tr><td>Water</td>
<td class="amount">{{resourceStorage.resourceTwo}}</td></tr>
<tr><td>Fuel</td>
<td class="amount">{{resourceStorage.resourceThree}}</td></tr>
<tr><td>Organic</td>
<td class="amount">{{resourceStorage.resourceFour}}</td></tr>
</table>
</div>

<div class="box_bg boxes_plan">
<h1>Planet Information</h1>
<p>Pollution: {{planet.pollution}}<br>
Population: {{planet.current_population}}</p>
<p></p>
</div>

<div class="box_bg boxes_plan" style="margin-top: 20px;">
<br />

{% for settlement in colonies %}
<a href="/profiler/public?account_key='{{settlement.owner.key}}'">{{settlement.owner.user}}</a><br />
{% endfor %}

<!-- <br />
<input type="button" style="display:block; text-align: center;" class="green-button" onClick="window.location='/market/view';" value='MARKETPLACE'>
-->
<br />
<input type="button" style="display:block; text-align: center;" class="red-button" onClick="window.location='/solar_system/galactic_rescue';" value='GALACTIC RESCUE'>
</div>
</div>

<div id="curr-planet">
<h2 id="planet">{{planet.name}}</h2>
[{{planet.location.x}}, {{planet.location.y}}]
<p style="margin: 30px 0;"><img align="middle" src="{{planet.imgSrc}}" /></p>
</div>

<div id="right">
<div class="box_bg boxes_plan">
<h1>Units</h1><br />
<span style="line-height: 30px;">HANGER</span>
<table class="hanger">
<tr><td width="50%"><a href="javascript:showonlyone('newboxes_plan', 'ColonyS'); 
changeText('cost', '{{colshipcost}}'); chosenunit('purchase_form', 'shippicked', 'ColonyS');">Colony Ship</a> </td>
<td class="amount">x {{colony_cnt}}</td></tr>
<tr><td width="50%"><a href="javascript:showonlyone('newboxes_plan', 'RecyclingS'); 
changeText('cost', '{{recshipcost}}'); chosenunit('purchase_form', 'shippicked', 'RecyclingS');">Recycler</a></td>
<td class="amount"> x {{recycler_cnt}}</td></tr>
<tr><td width="50%"><a href="javascript:showonlyone('newboxes_plan', 'FreighterS'); 
changeText('cost', '{{freshipcost}}'); chosenunit('purchase_form', 'shippicked', 'FreighterS');">Freighter</a></td><td class="amount"> x {{freighter_cnt}}</td></tr>
<!--<tr><td width="50%"><a href="javascript:showonlyone('newboxes_plan', 'MegaFreighterS'); 
changeText('cost', '{{megafreshipcost}}'); chosenunit('purchase_form', 'shippicked', 'MegaFreighterS');">Mega Freighter</a></td><td class="amount"> x {{megafre_cnt}}</td></tr>
<tr><td width="50%"><a href="javascript:showonlyone('newboxes_plan', 'MOPPS'); 
changeText('cost', '{{moppshipcost}}'); chosenunit('purchase_form', 'shippicked', 'MOPPS');">MOPP</a></td><td class="amount"> x {{mopp_cnt}}</td></tr>-->
</table>


<p>
<form id="purchase_form" action='/planet/purchase/' >
<input type="hidden" name="shippicked" value="" />
{% if starportb %}
COST:<span id="cost"></span><br /><br />
<input type=submit style="display:block; text-align: center;" class="green-button" value='BUILD'>
{% else %}
Can not Build, planet does not have a Starport.<br /><br />
<span class="red-button">BUILD</span>
{% endif %}
</form>
</p>
</div>

<style type="text/css">starportsc { color: green } </style>
<style type="text/css">factorysc { color: red } </style>
<style type="text/css">advfactorysc { color: white } </style>

<div class="box_bg boxes_plan">
<h1>Buildings</h1><br />
<span style="line-height: 30px;">Structures</span>
<table class="hanger">
{% if colonized %}
<tr><td width="50%"><a href="javascript:showonlyone('newboxes_plan' ,'Starport'); changeText('cost2',  '{{starportcost}}'); chosenunit('purchase_form2', 'buildingpicked', 'Starport');"><starportsc>-Starport-</starportsc></a></td><td class="amount">x {{starport_cnt}}</td></tr>
{% if starportb %}
<tr><td width="50%"><a href="javascript:showonlyone('newboxes_plan' ,'AdvStarport'); changeText('cost2',  '{{advstarportcost}}'); chosenunit('purchase_form2', 'buildingpicked', 'Advanced Starport');"><starportsc>|Advanced Starport|</starportsc></a></td><td class="amount">x {{advstarport_cnt}}</td></tr>
{% endif %}
<tr><td width="50%"><a href="javascript:showonlyone('newboxes_plan' ,'SmallHU'); changeText('cost2', '{{smallHUcost}}'); chosenunit('purchase_form2', 'buildingpicked', 'Small Housing Unit');">-Small Housing Unit-</a></td><td class="amount">x {{shouse_cnt}}</td></tr>
<tr><td width="50%"><a href="javascript:showonlyone('newboxes_plan' ,'Factory'); changeText('cost2', '{{factorycost}}'); chosenunit('purchase_form2', 'buildingpicked', 'Factory');"><factorysc>-Factory-</factorysc></a></td><td class="amount">x {{factory_cnt}}</td></tr>
{% if factoryb %}
<tr><td width="50%"><a href="javascript:showonlyone('newboxes_plan' ,'SMEU'); changeText('cost2', '{{smeucost}}'); chosenunit('purchase_form2', 'buildingpicked', 'Supercooled Magnetic Extractor Upgrade');"><factorysc>|Supercooled Magnetic Extractor Upgrade|</factorysc></a></td><td class="amount">x {{smeu_cnt}}</td></tr>
<tr><td width="50%"><a href="javascript:showonlyone('newboxes_plan' ,'MediumHU'); changeText('cost2', '{{mediumHUcost}}'); chosenunit('purchase_form2', 'buildingpicked', 'Medium Housing Unit');"><factorysc>|Medium Housing Unit|</factorysc></a></td><td class="amount">x {{mhouse_cnt}}</td></tr>
<tr><td width="50%"><a href="javascript:showonlyone('newboxes_plan' ,'autoPL'); changeText('cost2', '{{autoPLcost}}'); chosenunit('purchase_form2', 'buildingpicked', 'Automated Production Lines');"><factorysc>|Automated Production Lines|</factorysc></a></td><td class="amount">x {{autoprodline_cnt}}</td></tr>
<tr><td width="50%"><a href="javascript:showonlyone('newboxes_plan' ,'AdvFactory'); changeText('cost2', '{{advfactorycost}}'); chosenunit('purchase_form2', 'buildingpicked', 'Advanced Factory');"><advfactorysc>|Advanced Factory|</advfactorysc></a></td><td class="amount">x {{advfactory_cnt}}</td></tr>
{% if advfactoryb %}
<tr><td width="50%"><a href="javascript:showonlyone('newboxes_plan' ,'LargeHU'); changeText('cost2', '{{largeHUcost}}'); chosenunit('purchase_form2', 'buildingpicked', 'Large Housing Unit');"><advfactorysc>-|Large Housing Unit|-</advfactorysc></a></td><td class="amount">x {{lhouse_cnt}}</td></tr>
<tr><td width="50%"><a href="javascript:showonlyone('newboxes_plan' ,'NanoAssembly'); changeText('cost2', '{{nanoassemblycost}}'); chosenunit('purchase_form2', 'buildingpicked', 'Nanorobotics Assembly');"><advfactorysc>-|Nanorobotics Assembly|-</advfactorysc></a></td><td class="amount">x {{nanassembly_cnt}}</td></tr>
<tr><td width="50%"><a href="javascript:showonlyone('newboxes_plan' ,'DCMEU'); changeText('cost2', '{{dcmeucost}}'); chosenunit('purchase_form2', 'buildingpicked', 'Deep Core Mining Extractor Upgrade');"><advfactorysc>-|Deep Core Mining Extractor Upgrade|-</advfactorysc></a></td><td class="amount">x {{dcmeu_cnt}}</td></tr>
{% endif %}
{% endif %}
{% endif %}
</table>

<p>
<form id="purchase_form2" action='/planet/purchase/building/' >
<input type="hidden" name="buildingpicked" value="" />
{% if colonized %}
COST:<span id="cost2"></span><br /><br />
<input type=submit style="display:block; text-align: center;" class="green-button" value='BUILD'>
{% else %}
Can't Build, planet not colonized.
<span class="red-button">BUILD</span>
{% endif %}
</form>
</p>
</div>

<div class="box_bg boxes_plan" style="margin-top: 20px; text-align: center;"> 

<div class="toggle" name="newboxes_plan" id="ColonyS">
{% if colonized %}
<span class="red-button" style="width:auto;">COLONIZE</span>
{% else %}
<input type="button" style="display:block; text-align: center;" class="green-button" onClick="window.location='/planet/colonize/?id={{planet.key}}';" value='COLONIZE'>
{% endif %}

</div>



<div class="toggle" name="newboxes_plan" id="RecyclingS">
<p>Pollution: {{planet.pollution}}</p>
<form id="clean_form" action='/planet/clean/' method="post">
<input type=hidden name="cleanertype" value="normal">
<p>The cost to clean is 1 of each resource per 2 pollution.</p>
<p>Enter amount of resource to spend on cleaning: </p>
<input type="text" name="spendthis" style="width:50px;" />
<input type=submit style="display:block; text-align: center;" name="cleanb" class="green-button" value='CLEAN' />
</form>
</div>

<div class="toggle" name="newboxes_plan" id="MOPPS">
<p>Pollution: {{planet.pollution}}</p>
<form id="clean_form" action='/planet/clean/' method="post">
<input type=hidden name="cleanertype" value="mopp">
<p>The cost to clean is 20 of each resource per 1 pollution.</p>
<p>Enter amount of pollution to clean: </p>
<input type="text" name="cleanthis" style="width:50px;" />
<input type=submit style="display:block; text-align: center;" name="cleanb" class="green-button" value='CLEAN' />
</form>
</div>

<div class="toggle" name="newboxes_plan" id="FreighterS">
<p>Select the freighter ship you would like to unload:</p>
<form action='/planet/storage/' method="post">
<input type=hidden name="freightertype" value="normal">
<select  style="width: 50%;" name="freighter">
{% for freighter in freighters %}
<option value="{{freighter.key}}">{{freighter.name}}</option>
{% endfor %}
</select>
<p>Enter in the amount of each resource that you want to load or unload:</p>
<table>
<tr>
<td id="fuel" width="50px">Minerals</td><td><input type="text" name="Minerals" style="width: 50px;"/></td>
</tr><tr>
<td id="metal" width="50px">Water</td><td><input type="text" name="Water" style="width: 50px;"/></td>
</tr><tr>
<td id="food" width="50px">Fuel</td><td><input type="text" name="Fuel" style="width: 50px;"/></td>
</tr><tr>
<td id=" labor" width="50px">Organic</td><td><input type="text" name="Organic" style="width: 50px;"/></td>
</tr></table>
<br />
<input type=submit style="display:block; text-align: center;" name="loadb" class="green-button" value='LOAD' /><br />
<input type=submit  style="display:block; text-align: center;" name="unloadb" class="green-button" value='UNLOAD' /><br />
</form>
</div>

<div class="toggle" name="newboxes_plan" id="MegaFreighterS">
<p>Select the freighter ship you would like to unload:</p>
<form action='/planet/storage/' method="post">
<input type=hidden name="freightertype" value="mega">
<select  style="width: 50%;" name="freighter">
{% for megafreighter in megafreighters %}
<option value="{{megafreighter.key}}">{{megafreighter.name}}</option>
{% endfor %}
</select>
<p>Enter in the amount of each resource that you want to load or unload:</p>
<table>
<tr>
<td id="fuel" width="50px">Minerals</td><td><input type="text" name="Minerals" style="width: 50px;"/></td>
</tr><tr>
<td id="metal" width="50px">Water</td><td><input type="text" name="Water" style="width: 50px;"/></td>
</tr><tr>
<td id="food" width="50px">Fuel</td><td><input type="text" name="Fuel" style="width: 50px;"/></td>
</tr><tr>
<td id=" labor" width="50px">Organic</td><td><input type="text" name="Organic" style="width: 50px;"/></td>
</tr></table>
<br />
<input type=submit style="display:block; text-align: center;" name="loadb" class="green-button" value='LOAD' /><br />
<input type=submit  style="display:block; text-align: center;" name="unloadb" class="green-button" value='UNLOAD' /><br />
</form>
</div>

<div class="toggle" name="newboxes_plan" id="Colony">
<p>The Colony allows you to build the Starport, Small Housing Unit, and the Factory.</p>
</div>

<div class="toggle" name="newboxes_plan" id="Starport">
<p>The Starport allows you to build your basic ship units.</p>
</div>

<div class="toggle" name="newboxes_plan" id="AdvStarport">
<p>The Advanced Starport allows you to build freighters and scout ships.</p>
</div>

<div class="toggle" name="newboxes_plan" id="SmallHU">
<p>The Small Housing Unit provides the planet with one additional population.</p>
</div>

<div class="toggle" name="newboxes_plan" id="Factory">
<p>The Factory provides you with more advanced buildings.</p>
</div>

<div class="toggle" name="newboxes_plan" id="SMEU">
<p>Allows player to ignore up to 5 pollution when collecting resources.</p>
</div>

<div class="toggle" name="newboxes_plan" id="MediumHU">
<p>Medium Housing Units add an additional four population to the planet.</p>
</div>

<div class="toggle" name="newboxes_plan" id="autoPL">
<p>The Automated Production Line gives you a discount of 2 to all resource when
building a ship or constructing a building.</p>
</div>

<div class="toggle" name="newboxes_plan" id="AdvFactory">
<p>The Advanced Factory provides you with even greater advanced buildings.</p>
</div>

<div class="toggle" name="newboxes_plan" id="LargeHU">
<p>The Large Housing Unit adds 10 population to the planet.</p>
</div>

<div class="toggle" name="newboxes_plan" id="NanoAssembly">
<p>Nanorobotics Assembly provides you with an additional discount of 4 to all resources on anything you build.</p>
</div>

<div class="toggle" name="newboxes_plan" id="DCMEU">
<p>The Deep Core Mining Extractor Upgrade allows a player to ignore up to 10 pollution when collecting resources.</p>
</div>


</div>
</div>
</div>

{% endblock content %}